import { ref, onMounted } from 'vue'
import { defineStore } from 'pinia'

const useSystemStore = defineStore('system', () => {
    const sysTheme = ref(false)

    onMounted(() => {
        sysTheme.value = localStorage.getItem('darkTheme') === 'yes' ? true : false
    })

    const toggleTheme = () => {
        sysTheme.value = !sysTheme.value
        localStorage.setItem('darkTheme', sysTheme.value ? 'yes' : 'no')
    }

    return {
        sysTheme,
        toggleTheme,
    }
})

export default useSystemStore
